import React from 'react';
import {Layout, Modal} from 'antd';
import './index.less';
import {connect} from "dva";
import Curd from "components/Curd";
import DataTable from "components/Base/DataTable";
import Button from "components/Base/Button";
import Icon from "components/Base/Icon";
import BaseComponent from "components/Base/BaseComponent";
import PushDetails from "./PushDetails";
import $$ from "utils/index";

const {Content, Footer, Header} = Layout;

@connect(({pushRecordList}) => ({pushRecordList}))
export default class extends BaseComponent {

  state = {
    visible: false,
  }

  getNamespace() {
    return 'pushRecordList';
  }
  getTableColumns(self) {
    return [
      {
        title: '设备Id',
        name: 'deviceId',
        tableItem: {},
      },
      {
        title: '收到时间',
        name: 'detectTime',
        tableItem: {},
      },
      {
        title: '最后推送时间',
        name: 'lastPushTime',
        tableItem: {},
      },

      {
        title: '推送次数',
        name: 'pushTimes',
        tableItem: {
          render: (text, record) => {
            return (
              <DataTable.Oper>
                <a onClick={e => {
                  self.props.showBindDevices(record.id);
                }}>
                  <span>{record.pushTimes}次</span>
                </a>
              </DataTable.Oper>
            );
          }
        },
      },
      {
        title: '状态',
        name: 'pushStatus',
        dict: [
          {code: 0, codeName: '失败'},
          {code: 1, codeName: '成功'},
          {code: 2, codeName: '重试中'}],
        tableItem: {
          filters: [
            {
              value: 0,
              text: '失败',
            },
            {
              value: 1,
              text: '成功',
            },
            {
              value: 2,
              text: '重试中',
            },
          ]
        },
      },

      {
        title: '内容',
        name: 'pushContent',
        tableItem: {
          render: (text, record) => {
            return (
              <DataTable.Oper>
                <a onClick={e => {
                  Modal.info({
                    title: '推送内容',
                    content: (
                      <span>
                        {record.pushContent}
                      </span>
                    ),
                    onOk() {},
                  });
                }}>
                  <span>详情点击查看</span>
                </a>
              </DataTable.Oper>
            );
          }
        },
      },

      // {
      //   title: '操作',
      //   tableItem: {
      //     render: (text, record) => (
      //       <DataTable.Oper>
      //         <Button tooltip="修改" onClick={e => self.onUpdate(record)}>
      //           <Icon type="edit"/>
      //         </Button>
      //         <Button tooltip="重试" onClick={e => {
      //           this.rePush(record)
      //         }}>
      //           <Icon type="upload" />
      //         </Button>
      //       </DataTable.Oper>
      //     )
      //   }
      // }
    ]
  }

  // rePush = (record) =>{
  //   Modal.confirm({
  //     title: record.deviceId,
  //     content: `重新推送数据:${record.content}`,
  //     onOk: () => {
  //
  //     },
  //   });
  // }

  getSearchColumns(){
    return [{
      title: '设备id',
      name: 'deviceId',
      searchItem: {}
    }];
  }

  showBindDevices = (patientId) => {
    this.setState({visible: true, patientId});
  }

  handleCancel = () => {
    this.setState({visible: false});
  }

  render() {

    const {visible, patientId} = this.state;

    const curdProps = {
      ...this.props,
      namespace: this.getNamespace(),
      tableColumns: this.getTableColumns,
      searchColumns: this.getSearchColumns,
      showBindDevices: this.showBindDevices,
      showAddDelete: false,
      rePush: this.rePush,
    }

    return (
      <Layout>
        <Content>
          <Curd {...curdProps}/>
          <Modal
            title="绑定的设备列表"
            visible={visible}
            width={800}
            onCancel={this.handleCancel}
            footer={null}
          >
            <PushDetails patientId={patientId}/>
          </Modal>
        </Content>
      </Layout>
    );
  }

}
